Ext.define('NP.view.Main' ,{
	extend: 'Ext.panel.Panel',
    alias: 'widget.main',
    id	 : 'CafeDashboard',
    //border: false,
    layout : 'border',
	//bodyBorder: false,
	//bodyStyle: 'background-color:#2a3f5d',
    items : [{
    	xtype : 'panel',
      	region:'north',
      	height:80,
         layout : {
             type : 'table',
             columns : 4
         },
      	collapsible : false,
      	border  : false,
      	//bodyStyle: "background-image:url(./images/red-header.png)",
      	bodyStyle: 'background-color:#2a3f5d',
      	items : [{
          	xtype:'image',
            id: 'nim-logo',
            margin:'15 100 0 25',
            //src: './images/logo-portal.png',
      	},{
          	xtype:'image',
            id: 'telkomsel-logo',
            margin:'15 0 0 25',
            //src: './images/tsel-logo.png',		
      	},{          		
      		xtype:'tbfill',
      		width:802,
      	},{
      		xtype:'button',
      		cls: 'btn',
      		id :'welcome_user',
      		margin    :'42 0 0 0',
      		text :'Hi Admin',
      		border: 1,
      		style: {
      		    borderColor: 'white',
      		    borderStyle: 'solid'
      		},
      		width     : 130,
      		height    : 35,
      	    arrowAlign: 'right',
      	    /*listeners: {
		 	   beforerender: function(){
		 		  Ext.Ajax.request({
		    		    method: "GET",
		    		    dataType: "json",
		    		    url: "./Services/Security/User/CurrentUser",
		    		    async: false	,
		    		    success: function(c) {
		    		    	var jsonResults= $.parseJSON(c.responseText);
		    		    	data = jsonResults.item[0];
		    		    	Ext.getCmp('welcome_user').setText("<div class = textprofile>Hi "+data.USERNAME+" </div>");
		    		        }
		    		    });	
		 		  
					}
		    },*/
      	    menu      : [
      	        {	xtype: 'menuitem',
      	        	text: 'Setting',
      	        	icon    :'images/Profile.png',
      	        	border:true,
      	        	 height : 30,
		                /*listeners: { 
		            	   click: function(){
		            		   NewAddTab("myprofile","profile","MY PROFILE"); 
								}
		            
                        	},*/
	        		},
	        		 {	xtype: 'menuitem',
      	        	text: 'Logout',
      	        	icon    :'images/exit.png',
      	        	 height : 30,
		                /*listeners: { 
		            	   click: function(){
		            		   location.href='./Services/Security/User/Logout';
								}
		            
                        	},*/
	        		},
      	    ]
      	}]
    },{
        region: 'center',
        xtype: 'panel', // TabPanel itself has no title
    	title : 'Content',
    	id    : 'mainContent',
    	collapsible : false,
        margin : '5 0 0 0',
        items: [{
        	xtype: 'activityProgress'
        }]
    },{
    	region: 'west',
    	xtype : 'panel',
        collapsible: true,
        title: 'List Menu',
        margin : '5 5 0 0', // top right bot left
		width: 230,
		layout: 'fit',
        //bodyStyle: 'background-color:black'
        //layout: 'accordion',
        items: [{
			xtype: 'menu',
			collapsible: false,
			//plain: true,
		    floating: false, 
		    margin: '0 0 0 0',
		    //title   : 'Menu',
			text: 'Activity Progress',
			width: 250,
			items: [{
				height : 30,
				text: 'Activity Progress',
				icon:'images/overview.png',
				listeners:{
					click: function(){
						Ext.getCmp('mainContent').removeAll(true);
						Ext.getCmp('mainContent').add({xtype:'activityProgress'});
					}
				} 
		    },{
				height : 30,
		        text: 'Dashboard',
		        icon:'images/dashboard.png',
		        listeners:{
					click: function(){
						Ext.getCmp('mainContent').removeAll(true);
						Ext.getCmp('mainContent').add({xtype:'dashboard'});
					}
				}
		    }]
        }]	
    }]
         
});